

import React from 'react';
import {useSelector,useDispatch} from "react-redux";
import { addBanner } from '../../rtkStore/modules/home';

export default function RTKDemo() {

  const dispatch = useDispatch();
  const bannerList = useSelector(state=>state.home.bannerList);

  
  function addBannerFn(){
    dispatch(addBanner({
          "link": "2",
          "alt": "2",
          "img": "https://gimg3.baidu.com/search/src=http%3A%2F%2Fpics0.baidu.com%2Ffeed%2F78310a55b319ebc4c061c377e7b56ff01f171666.jpeg%40f_auto%3Ftoken%3Db32023b11c69bd3889c56d2e2142c271&refer=http%3A%2F%2Fwww.baidu.com&app=2021&size=f360,240&n=0&g=0n&q=75&fmt=auto?sec=1692118800&t=301d10ca47f0f885909f32b29f5f4bbc",
          "bannerid": "banner_351aa6ff-7017-4dd5-90a2-6eb8cf9e11b5",
          "flag": true
      }))
  }

  return (
    <div>
        <h1>子组件</h1>
        <ul>
          {
            bannerList.map(item=><li key={item.bannerid}>{item.bannerid}</li>)
          }
        </ul>
        <input type="button" value="添加轮播图数据" onClick={addBannerFn} />
    </div>
  )
}

